import React from 'react'
import './hot-brand.scss'

export default class HotBrand extends React.Component {
    state = {
        shopList: [],
        tabIndex: -1
    }
    componentDidMount() {
        this.$axios.get('https://apipc-xiaotuxian-front.itheima.net/home/brand?limit=10').then((res) => {
            if (res.data.msg == '操作成功') {
                this.setState({
                    shopList: res.data.result
                })
            }
        })
    }
    render() {
        return (
            <div id='hotbrand'>
                <div className="news">
                    <div className="container">
                        <div className="head">
                            <h3>热门品牌 <span>国际经典 品质保证</span></h3>
                            <div className="left">&lt;</div>
                            <div className="right">&gt;</div>
                        </div>
                        <div className="content">
                            <ul>
                                {this.state.shopList.map((item, index) => {
                                    return (
                                        <li key={index} >
                                            <a href="">
                                                <img src={item.picture} alt="" />
                                            </a>
                                        </li>
                                    )
                                })}
                            </ul>
                        </div>
                    </div>
                </div>
            </div >
        )
    }
}